<template>
	<view>
		<view style="background-color: white;margin-bottom: 120upx;">
			<view style="padding-right: 20upx;line-height: 2;">
				<text style="padding-left: 20upx;border-left: 5upx solid #FF387B;font-weight: bold;">自提点信息:</text>
				<text style="float: right;">选择自提点</text>
			</view>
			<view style="padding: 20upx;line-height: 2.5;font-size: 22upx;border-bottom: 1upx solid #F8F8F8;">
				<view>
					<text>{{team.teamName}}</text>
					<text style="float: right;">{{team.mobile}}</text>
				</view>
				<view>{{team.address}}</view>
			</view>

			<view style="padding-right: 20upx;line-height: 2;">
				<text style="padding-left: 20upx;border-left: 5upx solid #FF387B;font-weight: bold;">商品信息:</text>
			</view>
			<view v-for="(item,key) in carts" :key="key" style="margin: 20upx;padding: 15upx;box-shadow: 5upx 5upx 10upx 5upx #F5F5F5;display: flex;flex-direction: row;">
				<image style="width: 250upx;height: 200upx;" :src="item.goods.picUrl"></image>
				<view style="height: 200upx;flex: 1;padding-left: 20upx;display: flex;justify-content: space-between;flex-direction: column;">
					<view>{{item.goods.name}}</view>
					<view>
						<text>单价：￥{{item.goods.favorablePrice}}</text>
						<text style="float: right;">购买分数：{{item.count}}</text>
					</view>
				</view>
			</view>
			<view style="padding-right: 20upx;line-height: 2;">
				<text style="padding-left: 20upx;border-left: 5upx solid #FF387B;font-weight: bold;">订单备注:</text>
			</view>
			<view style="margin: 20upx;">
				<textarea v-model="remark" placeholder="请添加备注信息" style="padding: 20upx;font-size: 25upx;line-height: 1.5;width: auto;height: 75upx;background-color: #F4F4F4;"></textarea>
				<view style="background-color: #F4F4F4;font-size: 25upx;text-align: right;padding: 20upx;">
					0/100
				</view>
			</view>
			<view style="padding-right: 20upx;border-top: 1upx solid #F8F8F8;border-bottom: 1upx solid #F8F8F8;line-height: 80upx;">
				<text style="padding-left: 20upx;border-left: 5upx solid #FF387B;font-weight: bold;"><text>优惠券</text></text>

				<text>未选择</text>
				<text style="float: right;">暂无可用></text>
			</view>
			<view style="padding-right: 20upx;line-height: 2;">
				<text style="padding-left: 20upx;border-left: 5upx solid #FF387B;font-weight: bold;">结算金额:</text>
			</view>
			<view style="padding: 20upx;">
				<view style="line-height: 45upx;font-size: 26upx;">
					<text>促销优惠：</text>
					<text style="float: right;">￥0.00</text>
				</view>
				<view style="line-height: 45upx;font-size: 26upx;">
					<text>领券优惠：</text>
					<text style="float: right;">￥0.00</text>
				</view>
				<view style="line-height: 45upx;font-size: 26upx;">
					<text>余额抵扣：</text>
					<text style="float: right;">￥0.00</text>
				</view>
				<view style="line-height: 45upx;font-size: 26upx;">
					<text>商品金额：</text>
					<text style="float: right;">￥{{goodsPrice}}</text>
				</view>
				<view style="line-height: 45upx;font-size: 26upx;">
					<text>实付金额：</text>
					<text style="float: right;">￥{{actualPrice}}</text>
				</view>
			</view>
		</view>
		<!-- 底部 -->
		<view style="position: fixed;left: 0;right: 0;bottom: 0;height: 100upx;display: flex;align-items: center;flex-direction: row;background-color: white;padding: 0 20upx;border-top: 1upx solid #F8F8F8;">
			<view style="flex: 1;">已优惠：￥0.00</view>
			<view style="text-align: center;flex: 1;font-weight: bold;">
				<text style="">合计：</text>
				<text style="color: #FF387B;">￥{{actualPrice}}</text>
			</view>
			<view style="text-align: right;flex: 1;">
				<text @tap="submit" style="padding: 18upx 55upx;border-radius: 40upx;background-color: #FF387B;color: white;">去支付</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				user: {},
				carts: [],
				goodsPrice: 0,
				actualPrice: 0,
				team: {},
				remark: ''
			}
		},
		onLoad(e) {
			var user = uni.getStorageSync('user')
			if (user) {
				this.user = JSON.parse(user)
			}
			this.carts = JSON.parse(decodeURIComponent(e.carts))
			this.team = JSON.parse(decodeURIComponent(e.team))
			this.calculate()
		},
		methods: {
			calculate() {
				for (var i = 0; i < this.carts.length; i++) {
					this.goodsPrice += this.carts[i].goods.favorablePrice * this.carts[i].count
					this.actualPrice += this.carts[i].goods.favorablePrice * this.carts[i].count
				}
			},
			submit() {
				uni.showLoading({
					title: '加载中'
				});
				uni.request({
					url: this.apiUrl + "/client/order/createOrder",
					method: "POST",
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						token: this.user.token,
						carts: JSON.stringify(this.carts),
						team: JSON.stringify(this.team),
						amount: 0.01,
						// consigneeName: this.address.userName, // 收货人姓名
						// consigneeMobile: this.address.telNumber, // 收货人手机号
						// consigneeProvince: this.address.provinceName, // 省份
						// consigneeCity: this.address.cityName, // 城市
						// consigneeArea: this.address.countyName, // 收货地址所在区
						// consigneeAddress: this.address.detailInfo, // 详细地址
						remark: this.remark
					},
					success: (res) => {
						uni.hideLoading();
						const result = res.data;
						if (result.code == 200) {
							var order = result.data;
							var orderId = order.orderId;
							var traceNo = order.traceNo;
							var amount = order.amount;
							console.log("orderId", orderId)
							console.log("traceNo", traceNo)
							console.log("amount", amount)
							this.pay(traceNo, amount);
						} else {
							uni.showToast({
								title: result.errorMsg,
								icon: "none"
							});
						}
					},
					fail: (res) => {
						uni.hideLoading();
						uni.showToast({
							title: res.errMsg,
							icon: "none"
						});
					}
				})
			},
			pay(traceNo, amount) {
				uni.request({
					url: this.apiUrl + "/client/order/smallRoutinePay",
					method: "POST",
					header: {
						'content-type': 'application/x-www-form-urlencoded'
					},
					data: {
						token: this.user.token,
						traceNo: traceNo,
						amount: amount
					},
					success: (res) => {
						const result = res.data;
						if (result.code == 200) {
							var data = result.data;
							console.log(data)
							uni.requestPayment({
								provider: 'wxpay',
								timeStamp: data.timeStamp,
								nonceStr: data.nonceStr,
								package: data.packageValue,
								signType: data.signType,
								paySign: data.paySign, //微信签名
								success: (res) => {
									// console.log(res);
									// console.log(res.errMsg === 'requestPayment:ok');
									if (res.errMsg === 'requestPayment:ok') {
										uni.showToast({
											title: "支付成功",
											mask: false
										});
									}
								},
								fail: (err) => {
									if (err.errMsg === 'requestPayment:fail cancel') {
										uni.showToast({
											title: '暂不支付',
											icon: 'none'
										});
										setTimeout(() => {
											uni.navigateTo({
												url:'../orders/orders?type=1&status=0'
											})
										}, 1000)
									} else {
										uni.showModal({
											title: '错误提示',
											content: err.errMsg,
											showCancel: false,
											confirmText: '关闭',
										});
									}
								}
							});
						} else {
							uni.showToast({
								title: result.errorMsg,
								icon: "none"
							});
						}
					},
					fail: (res) => {
						uni.showToast({
							title: res.errMsg,
							icon: "none"
						});
					}
				})
			}
		}
	}
</script>

<style>

</style>
